<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <body>

        <ui:composition template="./../../WEB-INF/templates/newMainCompanyTemplate.xhtml">

            <ui:define name="companyContent">
                <h:outputStylesheet library="css" name="company/company.css"></h:outputStylesheet>
                <h:outputStylesheet library="css" name="company/credits.css"></h:outputStylesheet>
                <h:outputStylesheet library="css" name="company/credits_desktop.css" media="screen and (min-width:1025px) and (max-width:1600px)"></h:outputStylesheet>
                <h:outputStylesheet library="css" name="company/credits_desktop_wide.css" media="screen and (min-width : 1601px)"></h:outputStylesheet>
                <h:outputStylesheet library="css" name="company/credits_tablet.css" media="screen and (min-device-width : 768px) and (max-device-width : 1024px), screen and (max-width:1024px)"></h:outputStylesheet>
                <h:outputStylesheet library="css" name="company/credits_smartphone.css" media="screen and (min-device-width : 320px) and (max-device-width : 767px), screen and (max-width:767px)"></h:outputStylesheet>


                <form name="compra" id="tpvForm" action='https://sis.sermepa.es/sis/realizarPago' method="POST" target="tpv">
                    <h:panelGrid id="tpvPanelGrid" columns="3">
                        <h:panelGrid rendered="#{tPVBean.chosenCompanyProduct!=null}" columns="3">
                            <input type="hidden" name="Ds_Merchant_MerchantName" value="#{tPVBean.merchantName}"></input>
                            <input type="hidden" name="Ds_Merchant_MerchantCode" value="#{tPVBean.merchantCode}"></input>
                            <input type="hidden" name="Ds_Merchant_Terminal" value="#{tPVBean.merchantTerminal}"></input>
                            <input type="hidden" name="Ds_Merchant_Order" value="#{tPVBean.merchantOrder}"></input>
                            <input type="hidden" name="Ds_Merchant_Amount" value="#{tPVBean.amount}"></input>
                            <input type="hidden" name="Ds_Merchant_Currency" value="#{tPVBean.merchantCurrency}"></input>
                            <input type="hidden" name="Ds_Merchant_TransactionType" value="#{tPVBean.merchantTransactionType}"></input>
                            <input type="hidden" name="Ds_Merchant_MerchantURL" value="#{tPVBean.merchantURL}"></input>
                            <input type="hidden" name="Ds_Merchant_MerchantSignature" value="#{tPVBean.merchantSignature}"></input>
                        </h:panelGrid>
                    </h:panelGrid>
                </form> 

                <h:form id="creditCompanyDialogForm">
                    <p:dialog modal="true" style="width:250px;" header="#{messages.AreYouSure}" resizable="false" id="creditCompanyDialog" widgetVar="creditCompanyDialog"  draggable="true" closable="true">  
                        <p:panel id="creditCompanyDialogPanel" styleClass="noBorder noBorder noPadding">
                            <div class="inlineBlock verticalAlignTop internalRightDivWidth">
                                <p:outputLabel for="numberCredits" value="#{messages.Product}" />
                            </div>
                            <div class="inlineBlock verticalAlignTop internalLeftDivWidth">
                                <p:outputLabel styleClass="marginLeft20" id="numberCredits" value="#{tPVBean.chosenCompanyProduct.credits} #{messages.Credits}"/>
                            </div>
                            <div class="inlineBlock verticalAlignTop  internalRightDivWidth">
                                <p:outputLabel for="price" value="#{messages.TotalToPaid}" />
                            </div>
                            <div class="inlineBlock verticalAlignTop internalLeftDivWidth">
                                <p:outputLabel styleClass="marginLeft20" id="price" value="#{tPVBean.chosenCompanyProduct.currentPrice}" />
                            </div>
                            <div  class="inlineBlock verticalAlignTop textAlignLeft width100">
                                <p:commandButton process="@this" value="#{messages.No}" onsuccess="creditCompanyDialog.hide();" update="creditCompanyDialog" styleClass="blueBackgroundStrong marginTop1em creditCompanyButton"/>  
                                <p:commandButton process="@parent" value="#{messages.Yes}" actionListener="#{tPVBean.confirmBuy()}" oncomplete="creditCompanyDialog.hide();calc();" update="@(#tpvPanelGrid) creditCompanyDialogPanel :creditCompanyHistoricForm:panelCompanyHistoricCredit" styleClass="blueBackgroundStrong marginTop1em creditCompanyButton"/> 
                            </div>
                        </p:panel>
                    </p:dialog>                        
                </h:form>

                <h:form id="creditCompanyForm"  styleClass="verticalAlignTop inlineBlock creditCompanyForm">
                    <p:growl id="creditCompanyGrowl" showDetail="false" life="4000"/>
                    <p:panel header="#{messages.BuyCompanyProduct}" styleClass="darkGrayBackgroundTitle darkGrayBorder panelCompanyCredit noPaddingTitle" id="panelCompanyCredit">
                        <p:panel style="margin-bottom: 1.5em!important;">
                            <ui:repeat value="#{productsCompanyBean.entityList}" var="companyProduct">
                                <div  class="inlineBlock verticalAlignTop creditsForBuyDiv">
                                    <p:commandButton process="@this" value="#{companyProduct.description}" update=":creditCompanyDialogForm:creditCompanyDialogPanel" onsuccess="creditCompanyDialog.show();" actionListener="#{productsCompanyBean.chooseEntity(companyProduct)}" styleClass="marginTop1em creditsForBuyButton"/>  
                                </div>
                            </ui:repeat>
                        </p:panel>

                        <p:panel styleClass="noMargin noPadding noBorder"></p:panel>

                    </p:panel>
                </h:form>


                <h:form id="creditCompanyHistoricForm"  styleClass="verticalAlignTop inlineBlock creditCompanyHistoricForm">
                    <p:panel header="#{messages.CreditsCompanyHistoric}" styleClass="darkGrayBackgroundTitle darkGrayBorder panelCompanyCredit noPaddingTitle widht100" id="panelCompanyHistoricCredit">
                        <p:panel>
                            <ui:repeat value="#{newOrdersCompanyBean.entityList}" var="companyOrder">
                                <div class="historicBox strongGraySlimBorder inlineBlock strongGraySectionBackground">
                                    <div class="internalCreditsLeftColumn colorWhite inlineBlock verticalAlignTop">
                                        <h:outputText value="#{messages.IdCompanyOrder}"></h:outputText>
                                     </div>
                                    <div class="internalCreditsRightColumn inlineBlock verticalAlignTop">
                                        <h:outputText value="#{companyOrder.idCompanyOrder}"></h:outputText>
                                    </div>
                                    <div class="internalCreditsLeftColumn colorWhite inlineBlock verticalAlignTop">
                                        <h:outputText value="#{messages.DateCompanyOrder}" ></h:outputText>  
                                    </div>
                                    <div class="internalCreditsRightColumn inlineBlock verticalAlignTop">
                                        <h:outputText value="#{companyOrder.date}" >
                                            <f:convertDateTime pattern="d/M/yyyy - HH:mm"></f:convertDateTime>
                                        </h:outputText>
                                    </div>
                                    <div class="internalCreditsLeftColumn colorWhite inlineBlock verticalAlignTop">
                                        <h:outputText value="#{messages.AmountCompanyOrder}"></h:outputText>
                                    </div>
                                    <div class="internalCreditsRightColumn inlineBlock verticalAlignTop">
                                        <h:outputText value="#{companyOrder.amount}" ></h:outputText>
                                    </div>
                                    <div class="internalCreditsLeftColumn colorWhite inlineBlock verticalAlignTop">
                                        <h:outputText value="#{messages.DescriptionCompanyOrder}"></h:outputText>
                                    </div>
                                    <div class="internalCreditsRightColumn inlineBlock verticalAlignTop">
                                        <h:outputText value="#{companyOrder.companyProduct.description}" ></h:outputText>
                                    </div>
                                    
                                    <div class="internalCreditsLeftColumn colorWhite inlineBlock verticalAlignTop">
                                        <ui:param name="Yes" value="#{messages.Yes}" />
                                        <ui:param name="No" value="#{messages.No}" />
                                        <h:outputText value="#{messages.PayedCompanyOrder}"></h:outputText>
                                    </div>
                                    <div class="internalCreditsRightColumn inlineBlock verticalAlignTop">
                                        <h:outputText value="#{companyOrder.isPayed == true ? Yes:No}" ></h:outputText>
                                    </div>
                                </div>
                            </ui:repeat>
                        </p:panel>
                    </p:panel>
                </h:form>

                <script type="text/javascript" >
                    function calc() {
                        //vent=window.open("","tpv","width=480,height=475,scrollbars=no,resizable=yes,status=yes,menubar=no,location=no");
                        $("#tpvForm").submit();
                    }
                </script>
            </ui:define>

        </ui:composition>

    </body>
</html>
